<template>
  <el-select
    :value="city"
    filterable
    placeholder="请选择"
    @change="changeCity"
    :style="customStyle"
    :disabled="disabled"
  >
    <el-option
      v-for="item in city_options"
      :key="item.value"
      :label="item.label"
      :value="item.value"
    >
    </el-option>
  </el-select>
</template>
<script>
import { CITY_OPTIONS } from '@/utils/platform'
export default {
  name: 'CitySelect',
  computed: {},
  props: {
    customStyle: {
      type: String,
      default: 'width: 150px'
    },
    disabled: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      city_options: [
        {
          value: '',
          label: '全部'
        },
        ...CITY_OPTIONS
      ],
      city: '1'
    }
  },
  methods: {
    changeCity(e) {
      this.city = e
      this.$emit('onChange', e)
    }
  }
}
</script>
<style scoped lang="less"></style>
